// 新增银行卡
<template>
    <div>
        <GoBack></GoBack>
        <div class="addbankBox">
             <p class="adselfBox">添加银行卡</p>
             <div class="addbankcardCont">
               <div class="selcetBox flex flex-align-center">
                 <p class="khh">开户行</p>
                 <select class="select" @change="onChangeBank">
                     <option :value="item.id" v-for="(item,index) in options" :key='index'>{{item.title}}</option>
                 </select>
                </div>
               <div class="selcetBox flex flex-align-center">
                 <p>真实姓名</p>
                 <input type="text" placeholder="输入绑定银行卡人的姓名" v-model.trim='full_name' :readonly='isreadonly'>
                </div>
                <div class="selcetBox flex flex-align-center">
                 <p>银行卡号</p>
                 <input type="text" placeholder="输入绑定银行卡号" v-model.trim='card_number'>
                </div>
                <div class="addBtn flex flex-align-center flex-pack-center" @click="onPostFun"><p>添加</p></div>
                <!-- 底部提示 -->
                <div class="addcardTips">
                    <p>姓名请填写真实身份证姓名，一经填写不允许修改！若想修改，请联系平台客服：{{QQNum}}。</p>
                </div>
             </div>
        </div>
    </div>
</template>
<script>
import GoBack from '../goback'
import https from '@/public/https'
export default {
    components: {
        GoBack,
    },
    data () {
        return {
             options:[],
             bank_id:'',
             full_name:'',
             card_number:'',
             QQNum:'',
             isreadonly:false,
        }
    },
    mounted () {
        this.getBankCardType();
        this.getServce();
        this.getObtainUserBankById();
    },
    methods: {
        onPostFun(){
            let uid = this.$store.state.userInfo.id;
            let _self = this;
            if(this.full_name != ''){
                if(this.card_number != ''){
                    https.post('user/postAddUserBankCard',{uid:uid,bank_id:this.bank_id,full_name:this.full_name,card_number:this.card_number})
                    .then(data => {
                        if(data.status == 1){
                             this.$message({
                                message: '添加成功',
                                type: 'success'
                                });
                            window.setTimeout( function(){
                                _self.$router.push('/BankCardList')
                            }, 3000); 
                        }else{
                             this.$message.error(data.message);
                        }
                        })
                }else{
                    this.$message.error('请输入本人名下的银行借记卡');
                }
            }else{
                 this.$message.error('请输入身份证姓名');
            }
        },
       getServce(){
            this.https('common/getObtainOnlineNumber')
            .then(data => {
                this.QQNum = data.server_qq;
            })
        },
        onChangeBank(ele){ //选择开户行
            this.bank_id = ele.target.value;
        },
        getBankCardType(){ //获取开户行信息
            this.https('/common/getObtainBankType')
            .then(data => {
                this.bank_id = data[0].id;
                this.options = data;
            })
        },
        getObtainUserBankById(){
            let uid = this.$store.state.userInfo.id;
            this.https('user/getObtainUserBankById',{uid:uid})
            .then(data => {
                    if(data.full_name){
                        this.full_name = data.full_name;
                        this.isreadonly = true;
                    }
            })
        }
    }
}
</script>
<style lang="less" scoped>
@import url(../../assets/css/usercenter/addbankcard.less);
</style>


